<div class="modal fade" id="express-info-dlg">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" style="font-size: 16px;line-height: 30px">
                    快递物流信息
                    <i data-dismiss="modal" class="iconfont icon-guanbi"
                       style="float: right;font-size: 26px;cursor: pointer"></i>
                </h4>
            </div>
            <div class="modal-body">
                <div id="mohe-kuaidi_new">
                    <div>
                        <div class="mh-wrap">
                            <div class="mh-list-wrap mh-unfold">
                                <div class="mh-list">

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <a href="#" id="cancel-pro" class="btn btn-default" data-dismiss="modal">关闭</a>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script type="text/javascript">
    //获取物流数据并加入到模态框
    function getData(oid) {
        $.post("express-info/" + oid, function (data) {
            var obj = JSON.parse(data).data;
            $(".mh-list").empty().append(getHtml(obj));
            $("#express-info-dlg").modal();
        })
    }

    //根据JSON格式物流信息  返回html文本
    function getHtml(obj) {
        var str = "<ul>";
        var len = obj.length;
        if (len == 0) {
            str += "<h4 style='text-align: center'>暂无快递物流信息</h4>";
        } else {
            for (var i = 0; i < len; i++) {
                var time = obj[i].time;
                var context = obj[i].context;
                if (i == 0) {
                    str += "<li class='first'>";
                } else {
                    str += "<li>";
                }
                str += "<p>" + time + "</p>" +
                        "<p>" + context + "</p>";

                str += "<span class='before'></span>";

                str += "<span class='after'></span>";

                if (i == 0) {
                    str += "<i class='mh-icon mh-icon-new'></i>";
                }

                str += "</li>";
            }
        }
        str += "</ul>";
        return str;
    }
</script>